// 文章详情页面JS

document.addEventListener('DOMContentLoaded', function() {
    // 初始化页面功能
    initBackButton();
    initShareButton();
    initFollowButton();
    initLikeButtons();
    initReplyButtons();
    initCommentInput();
    initArticleLinks();
    
    // 初始化底部导航
    initTabBar();
    
    // 处理图片加载错误
    handleImageErrors();
});

// 返回按钮功能
function initBackButton() {
    const backBtn = document.querySelector('.back-btn');
    
    if (backBtn) {
        backBtn.addEventListener('click', function() {
            // 先检查是否有历史记录
            if (window.history.length > 1) {
                window.history.back();
            } else {
                // 如果没有历史记录，返回发现页
                window.location.href = 'discover.html';
            }
        });
    }
}

// 分享按钮功能
function initShareButton() {
    const shareBtn = document.querySelector('.action-btns i.bi-share');
    
    if (shareBtn) {
        shareBtn.addEventListener('click', function() {
            // 获取当前文章标题
            const title = document.querySelector('.article-title').textContent;
            
            // 如果浏览器支持网页分享API
            if (navigator.share) {
                navigator.share({
                    title: title,
                    text: '分享一篇关于AI产业的好文章',
                    url: window.location.href
                })
                .then(() => console.log('分享成功'))
                .catch((error) => console.log('分享失败:', error));
            } else {
                // 不支持分享API，显示提示
                showToast('复制链接成功，快去分享吧');
                
                // 复制当前URL到剪贴板
                const dummyInput = document.createElement('input');
                document.body.appendChild(dummyInput);
                dummyInput.value = window.location.href;
                dummyInput.select();
                document.execCommand('copy');
                document.body.removeChild(dummyInput);
            }
        });
    }
}

// 关注按钮功能
function initFollowButton() {
    const followBtn = document.querySelector('.follow-btn');
    
    if (followBtn) {
        followBtn.addEventListener('click', function() {
            // 切换关注状态
            if (this.textContent === '+ 关注') {
                this.textContent = '已关注';
                this.style.backgroundColor = 'rgba(63, 81, 181, 0.2)';
                showToast('关注成功');
            } else {
                this.textContent = '+ 关注';
                this.style.backgroundColor = 'rgba(63, 81, 181, 0.1)';
                showToast('已取消关注');
            }
        });
    }
}

// 点赞按钮功能
function initLikeButtons() {
    const likeButtons = document.querySelectorAll('.like-btn');
    
    likeButtons.forEach(btn => {
        btn.addEventListener('click', function() {
            // 获取当前点赞数
            const likeText = this.textContent.trim();
            let likeCount = parseInt(likeText.match(/\d+/)[0]);
            
            // 判断是否已点赞（通过检查按钮颜色）
            if (this.classList.contains('liked')) {
                // 已点赞，取消点赞
                likeCount--;
                this.innerHTML = `<i class="bi bi-hand-thumbs-up"></i> ${likeCount}`;
                this.classList.remove('liked');
                this.style.color = 'var(--gray-color)';
            } else {
                // 未点赞，添加点赞
                likeCount++;
                this.innerHTML = `<i class="bi bi-hand-thumbs-up-fill"></i> ${likeCount}`;
                this.classList.add('liked');
                this.style.color = 'var(--primary-color)';
            }
        });
    });
}

// 回复按钮功能
function initReplyButtons() {
    const replyButtons = document.querySelectorAll('.reply-btn');
    
    replyButtons.forEach(btn => {
        btn.addEventListener('click', function() {
            // 获取评论用户名
            const userName = this.closest('.comment-item').querySelector('.user-name').textContent;
            
            // 设置评论框内容和焦点
            const commentInput = document.querySelector('.comment-input input');
            commentInput.value = `回复 ${userName}：`;
            commentInput.focus();
            
            // 滚动到评论框位置
            commentInput.scrollIntoView({ behavior: 'smooth' });
        });
    });
}

// 评论输入功能
function initCommentInput() {
    const commentInput = document.querySelector('.comment-input input');
    const sendBtn = document.querySelector('.send-btn');
    
    if (commentInput && sendBtn) {
        // 回车发送评论
        commentInput.addEventListener('keypress', function(e) {
            if (e.key === 'Enter' && this.value.trim()) {
                sendComment();
            }
        });
        
        // 点击发送按钮
        sendBtn.addEventListener('click', function() {
            if (commentInput.value.trim()) {
                sendComment();
            }
        });
        
        // 发送评论的函数
        function sendComment() {
            // 获取评论内容
            const commentText = commentInput.value.trim();
            
            // 模拟发送评论（实际项目中应通过API发送）
            showToast('评论发送成功，等待审核');
            
            // 清空输入框
            commentInput.value = '';
            
            // 更新评论计数
            updateCommentCount(1);
        }
        
        // 更新评论计数的函数
        function updateCommentCount(increment) {
            const countElem = document.querySelector('.comment-count');
            if (countElem) {
                const currentCount = parseInt(countElem.textContent.match(/\d+/)[0]);
                const newCount = currentCount + increment;
                countElem.textContent = `（${newCount}）`;
            }
        }
    }
}

// 文章链接点击功能
function initArticleLinks() {
    const articleItems = document.querySelectorAll('.related-articles .article-item');
    
    articleItems.forEach(item => {
        item.addEventListener('click', function() {
            // 获取文章标题，用于记录点击
            const title = this.querySelector('h3').textContent;
            console.log(`查看相关文章: ${title}`);
            
            // 在实际项目中，这里应该是跳转到对应文章的详情页
            // 但由于这是演示，我们只是重新加载当前页面
            showToast('正在跳转到相关文章...');
            
            // 延迟一下模拟加载
            setTimeout(() => {
                window.location.reload();
            }, 800);
        });
    });
}

// 底部导航功能
function initTabBar() {
    const tabItems = document.querySelectorAll('.tab-bar .tab-item');
    
    tabItems.forEach((tab, index) => {
        tab.addEventListener('click', function() {
            // 如果不是当前标签，才进行跳转
            if (!this.classList.contains('active')) {
                switch(index) {
                    case 0: // 首页
                        window.location.href = '../index.html';
                        break;
                    case 1: // 发现
                        window.location.href = 'discover.html';
                        break;
                    case 2: // 经纪人
                        window.location.href = 'agents.html';
                        break;
                    case 3: // 我的
                        window.location.href = 'profile.html';
                        break;
                }
            }
        });
    });
}

// 显示提示消息
function showToast(message) {
    // 检查是否已有toast，有则移除
    const existingToast = document.querySelector('.toast-message');
    if (existingToast) {
        document.body.removeChild(existingToast);
    }
    
    // 创建提示框元素
    const toast = document.createElement('div');
    toast.className = 'toast-message';
    toast.textContent = message;
    
    // 设置提示框样式（如果没有全局样式）
    if (!document.querySelector('style[data-toast]')) {
        toast.style.position = 'fixed';
        toast.style.top = '60px';
        toast.style.left = '50%';
        toast.style.transform = 'translateX(-50%)';
        toast.style.padding = '8px 16px';
        toast.style.backgroundColor = 'rgba(0, 0, 0, 0.7)';
        toast.style.color = '#fff';
        toast.style.borderRadius = '4px';
        toast.style.zIndex = '1000';
        toast.style.opacity = '0';
        toast.style.transition = 'opacity 0.3s ease';
    }
    
    // 将提示框添加到body
    document.body.appendChild(toast);
    
    // 显示提示框
    setTimeout(() => {
        toast.style.opacity = '1';
    }, 10);
    
    // 2秒后隐藏并移除提示框
    setTimeout(() => {
        toast.style.opacity = '0';
        setTimeout(() => {
            if (document.body.contains(toast)) {
                document.body.removeChild(toast);
            }
        }, 300);
    }, 2000);
}

// 图片错误处理
function handleImageErrors() {
    const images = document.querySelectorAll('img');

    images.forEach(img => {
        img.addEventListener('error', function() {
            let imageType = 'generic';
            
            // 根据图片所在容器类型设置不同的替代图
            if (this.classList.contains('article-banner')) {
                imageType = 'banner';
            } else if (this.classList.contains('author-avatar') || this.classList.contains('user-avatar')) {
                imageType = 'avatar';
            } else if (this.closest('.article-img')) {
                imageType = 'article';
            }
            
            // 生成随机ID以获取不同图片
            const randomId = Math.floor(Math.random() * 1000);
            
            // 根据图片类型设置替代图
            switch(imageType) {
                case 'banner':
                    this.src = `https://source.unsplash.com/random/800x400/?ai,technology&sig=${randomId}`;
                    break;
                case 'avatar':
                    this.src = `https://i.pravatar.cc/150?img=${randomId % 70}`;
                    // 确保头像是圆形
                    this.style.objectFit = 'cover';
                    this.style.borderRadius = '50%';
                    break;
                case 'article':
                    this.src = `https://source.unsplash.com/random/300x200/?career,business&sig=${randomId}`;
                    break;
                default:
                    this.src = `https://source.unsplash.com/random/300x200/?business&sig=${randomId}`;
            }
            
            // 设置加载模式为立即加载
            this.loading = 'eager';
        });
    });
} 